<style lang="scss" scoped>
	@import url("@/static/css/flex.css");

	.boxList {
		width: 100%;
		height: auto;
		padding: 0 30rpx;
		box-sizing: border-box;
		padding-bottom: 30px;
	}

	.mNavbar {
		position: fixed;
		top: 0;
		left: 0;
		z-index: 1000;
		background-color: #fff;
		width: 100%;
		height: 176rpx;

		.nb {}
	}

	.main {
		box-sizing: border-box;

		.xffx {
			position: fixed;
			right: 30rpx;
			bottom: 180rpx;
			.share{
				width: 84rpx;
				height: 84rpx;
				padding: 0;
				border-radius: 50%;
				border: none;
				background: rgba(0,0,0,0);
			}
		}

		.marginBox {
			width: 100%;
			height: 20rpx;
			background: #F3F4F5;

		}

		.top {
			position: relative;
			width: 100%;
			height: 450rpx;

			// background-image: url(../../../static/homeImg/topImg.png);
			// background-size: 100% 450rpx;
			// background-repeat: no-repeat;
			.top_text {
				position: absolute;
				bottom: 0rpx;
				left: 0;
				width: 100%;
				height: auto;
				font-size: 40rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #FFFFFF;
				padding: 30rpx 40rpx;
				box-sizing: border-box;
			}
		}

		.userTx {
			width: 100%;
			height: 170rpx;
			padding: 0 30rpx;
			box-sizing: border-box;

			box-shadow: 0px 0px 0px 0px #DDDDDD;

			.userImg {
				width: 80rpx;
				height: 80rpx;
				border-radius: 50%;
				overflow: hidden;

				image {
					width: 100%;
					height: 100%;
				}
			}

			.content {
				width: 350rpx;
				margin-left: 20rpx;

				.title {
					height: 40rpx;
					font-size: 28rpx;
					font-family: PingFangSC-Semibold, PingFang SC;
					font-weight: 600;
					color: #333333;

				}

				.title1 {
					width: 80%;
					height: 28rpx;
					font-size: 20rpx;
					font-family: PingFangSC-Light, PingFang SC;
					font-weight: 300;
					color: #777777;
					line-height: 28rpx;
					margin-top: 4rpx;
					overflow: hidden;
					text-overflow: ellipsis;
					white-space: nowrap;
				}
			}

			.gz {
				width: auto;
				height: 56rpx;
				background: #FFF8F8;
				border-radius: 28rpx;
				border: 1px solid #DB1B22;
				font-size: 20rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #DB1B22;
				line-height: 56rpx;
				text-align: center;
				padding: 0 36rpx;
			}

			.gz1 {
				background: #F6F7F8;
				color: #AAAAAA;
				border: none;
			}

			.dzBox {
				width: 194rpx;
				height: 60rpx;
				background: linear-gradient(180deg, #FF8D9C 0%, #FD3D4D 100%);
				box-shadow: 0px 0px 20rpx 0px rgba(219, 27, 34, 0.4);
				border-radius: 36rpx;
				font-size: 20rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #FFFFFF;
				line-height: 60rpx;

				image {
					width: 24rpx;
					height: 24rpx;
					margin-right: 10rpx;
				}
			}

			.dzBox1 {
				opacity: 0.45;
			}
		}

		.contentWZ {
			width: 690rpx;
			height: auto;
			font-size: 28rpx;
			font-family: PingFangSC-Light, PingFang SC;
			font-weight: 300;
			color: #333333;
			margin: 30rpx auto;
		}
		.contentImg{
			width: 690rpx;
			margin: 15rpx auto;
			image{
				width: 100%;
			}
		}
		.contentvideo{
			height: 428rpx;
		}
		.te {
			width: 690rpx;
			height: 186rpx;
			background: #FFFFFF;
			border-radius: 10rpx;
			border: 2rpx solid #EEEEEE;
			margin: 15rpx auto;
			padding: 24rpx;
			box-sizing: border-box;

			.teImg {
				width: 230rpx;
				background: #D8D8D8;
				border-radius: 10rpx;
				overflow: hidden;

				image {
					width: 100%;
				}
			}

			.rightC {
				width: 388rpx;

				.content {
					width: 100%;
					height: 68rpx;
					font-size: 24rpx;
					font-family: PingFangSC-Semibold, PingFang SC;
					font-weight: 600;
					color: #333333;

				}

				.seewenz {
					width: 120rpx;
					height: 40rpx;
					background: #DB1B22;
					border-radius: 36rpx;
					font-size: 20rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #FFFFFF;
					text-align: center;
					line-height: 40rpx;
					float: right;
					margin-top: 24rpx;
				}
			}
		}

		.goods_information {
			// height: 438rpx;
			width: 100%;
			padding: 28rpx 30rpx;
			box-sizing: border-box;

			.goods_title {
				width: auto;
				text-align: left;
				height: 44rpx;
				font-size: 32rpx;
				font-family: PingFangSC-Medium, PingFang SC;
				font-weight: 500;
				color: #333333;
				line-height: 44rpx;

			}

			.goods_box {
				width: 690rpx;
				height: 160rpx;
				margin: 20rpx auto;

				.goods_img {
					width: 160rpx;
					height: 160rpx;
					background: #D8D8D8;
					border-radius: 10rpx;
					overflow: hidden;

					image {
						width: 100%;
						height: 100%;
					}
				}

				.rightcontent {
					width: 510rpx;
					height: 100%;

					.q {
						width: 100%;
						height: 68rpx;
						font-size: 24rpx;
						font-family: PingFangSC-Medium, PingFang SC;
						font-weight: 500;
						color: #333333;
					}

					.w {
						margin-top: 42rpx;

						.s {
							font-size: 36rpx;
							font-family: PingFangSC-Semibold, PingFang SC;
							font-weight: 600;
							color: #DB1B22;

							.r {
								font-size: 30rpx;
							}
						}

						.d {
							font-size: 24rpx;
							font-family: PingFangSC-Regular, PingFang SC;
							font-weight: 400;
							color: #777777;

							.c {
								font-size: 28rpx;
								font-family: PingFangSC-Semibold, PingFang SC;
								font-weight: 600;
								color: #DB1B22;
								margin-left: 10rpx;
							}
						}
					}
				}
			}

			.mm {
				font-size: 24rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #333333;
			}

			.kuang {
				width: 690rpx;
				height: auto;
				margin: 20rpx auto 0;
				background: #F9FAFB;
				border-radius: 6rpx;
				border: 1px solid #E5E6E7;
				font-size: 24rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #333333;
				padding: 10rpx 20rpx;
				box-sizing: border-box;
				position: relative;

				.ert {
					display: block;
					width: 0;
					height: 0;
					border-width: 0 20rpx 20rpx;
					border-style: solid;
					border-color: transparent transparent #E5E6E7;
					position: absolute;
					top: -20rpx;
					left: 7%;
					margin-left: -20rpx;

					.sdf {
						display: block;
						width: 0;
						height: 0;
						border-width: 0 20rpx 20rpx;
						border-style: solid;
						border-color: transparent transparent #fff;
						position: absolute;
						top: 1px;
						left: -20rpx;
					}
				}
			}
		}

			.Notice {
				padding: 30rpx;
				margin-top: 20rpx;
				padding-bottom: 0;
				background-color: #fff;

				.NoticeTitle {
					font-size: 32rpx;
					padding-bottom: 30rpx;
					font-family: PingFangSC-Semibold, PingFang SC;
					font-weight: 600;
					color: #333333;
				}

				.NoticeReminder {
					display: flex;
					padding: 24rpx 0;
					border-top: 1px dashed #DCDDDE;

					.ReminderLeft {
						font-size: 24rpx;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: #AAAAAA;
						width: 150rpx;
					}

					.ReminderRight {
						flex: 1;
						font-size: 24rpx;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: #333333;
					}
				}

				.NoticeClick {
					display: flex;
					padding: 24rpx 0;
					border-top: 1px solid #F7F7F7;
					align-items: center;
					justify-content: center;

					view {

						font-size: 24rpx;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: #999999;
					}

					image {
						width: 24rpx;
						height: 24rpx;
					}
				}
			}

		.jilITem {
			width: 690rpx;
			height: 90rpx;
			background: #FFFFFF;
			box-shadow: 0px 0px 0px 0px #DDDDDD;

			.icTe {
				font-size: 26rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #999999;
				margin-right: 40rpx;
			}

			.icTe1 {
				color: #333333;
			}
			.icTe2{
				    margin-right: 10rpx;
				width: auto;
				height: 40rpx;
				font-size: 20rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #EA302B;
				padding: 0 16rpx;
				line-height: 40rpx;
				background:url(../../../static/homeImg/icon/goods_redpacket.png) ;
				background-size: 100% 100%;
			}
			.lingquan{
				font-size: 26rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #777777;

			}

		}

		.line {
			width: 100%;
			height: 1px;
			background-color: #DDDDDD;
		}

		.comment {
			padding-bottom: 20rpx;
			.headerO {
				width: 100%;
				height: auto;
				padding: 30rpx 0;

				.q {
					font-size: 32rpx;
					font-family: PingFangSC-Medium, PingFang SC;
					font-weight: 500;
					color: #333333;

				}

				.w {
					font-size: 20rpx;
					font-family: PingFangSC-Semibold, PingFang SC;
					font-weight: 600;
					color: #333333;

					image {
						width: 24rpx;
						height: 24rpx;
					}
				}
			}

			.commentItem {
				border-bottom: 1px solid #EEEEEE;
				.userName {
					font-size: 24rpx;
					font-family: PingFangSC-Semibold, PingFang SC;
					font-weight: 600;
					color: #333333;

				}

				.NumLikes {
					font-size: 18rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #777777;

				}

				.content {
					font-size: 28rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #333333;
					margin: 20rpx 0;
				}

				.oprtu {
					width: 690rpx;
					background: #F6F7F8;
					border-radius: 10rpx;
					padding: 20rpx;
					box-sizing: border-box;

					.mt {
						font-size: 24rpx;
						font-family: PingFangSC-Semibold, PingFang SC;
						font-weight: 600;
						color: #777777;

					}

					.nptu {
						font-size: 24rpx;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: #333333;
						margin-top: 10rpx;
					}
				}
			}
			.commentItem1{
				width: 100%;
				height: 50px;
				display: flex;
				justify-content: center;
				align-items: center;
				    font-size: 26rpx;
				    font-family: PingFangSC-Regular, PingFang SC;
				    font-weight: 400;
				    color: #777777;
			}
		}

		.rmtjBox {
			.rmtj {
				font-size: 24rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #777777;
				padding: 30rpx 0;
			}

			.item {
				width: 330rpx;
				margin-bottom: 40rpx;

				.toc {
					width: 330rpx;
					height: 196rpx;
					background: #D8D8D8;
					border-radius: 10rpx;
					overflow: hidden;

					image {
						width: 330rpx;
						height: 196rpx;
					}
				}

				.toiff {
					height: 64rpx;
					margin-top: 10rpx;
					font-size: 24rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #333333;
					overflow: hidden;
					// text-overflow:ellipsis;
					display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
				}
			}
		}
		.savebottom {
			padding-bottom: 0;
			padding-bottom: constant(safe-area-inset-bottom);
			padding-bottom: env(safe-area-inset-bottom);
		}
		.tabbarGm {
			width: 100%;
			height: 98rpx;
			background: #FFFFFF;
			box-shadow: 0px 1px 0px 0px #DDDDDD;
			position: fixed;
			bottom: 0;
			left: 0;
			z-index: 99;
			// padding: 14rpx 30rpx;
			// box-sizing: border-box;
			display: flex;
			justify-content: center;
			.bgt {
				margin-right: 30rpx;
				button{
					height: 100%;
					margin: 0;
					padding: 0;
					line-height: normal;
					// position: none;
					border: none;
				}
				.aaaqwe {
					font-size: 16rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #777777;
					text-align: center;
				}
			}

			.gmBtn {
				width: 470rpx;
				height: 70rpx;
				background: linear-gradient(180deg, #FF8D9C 0%, #FD3D4D 100%);
				border-radius: 36rpx;
				font-size: 28rpx;
				font-family: PingFangSC-Semibold, PingFang SC;
				font-weight: 600;
				color: #FFFFFF;
				line-height: 70rpx;
				text-align: center;
				display: flex;
				align-items: center;
				justify-content: center;
			}
		}
		.canGetCoupon {
			// position: fixed;
			// bottom: 0;
			// left: 0;
			width: 100%;
			height: 50%;
			background: #fff;
			display: flex;
			flex-direction: column;
			padding: 30rpx;
			padding-bottom: 120rpx;
			box-sizing: border-box;
			z-index: 99;
			.item_title{
				text-align: center;
				margin-bottom: 20rpx;
				font-size: 28rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #333333;
			}
			.img{
				position: absolute;
				top: 20rpx;
				right: 8rpx;
			}
			.canGetCouponitem {
				// display: flex;
				// flex-direction: column;
				height: 500rpx;
				overflow-x: scroll;
				.item{
					width: 690rpx;
					height: auto;
					background: linear-gradient(90deg, #EC7172 0%, #FF928F 100%);
					border-radius: 10rpx;
					margin: 0 auto 30rpx;
					position: relative;
					overflow: hidden;
					color: #fff;
					padding: 0 40rpx 20rpx;
					box-sizing: border-box;
					.q{
						height: 140rpx;
						.dw{
							font-size: 32rpx;
							font-family: PingFangSC-Regular, PingFang SC;
							font-weight: 400;
							color: #FFFFFF;
							margin-top: 40rpx;
						}
						.jiazhi{
							font-size: 80rpx;
							font-family: DINAlternate-Bold, DINAlternate;
							font-weight: bold;
							color: #FFFFFF;
				
						}
						.fw{
							font-size: 32rpx;
							font-family: PingFangSC-Semibold, PingFang SC;
							font-weight: 600;
							color: #FFFFFF;
				
						}
						.rq{
							margin-top: 8rpx;
							font-size: 22rpx;
							font-family: PingFangSC-Regular, PingFang SC;
							font-weight: 400;
							color: #FFFFFF;
				
						}
						.ljsy{
							width: 140rpx;
							height: 44rpx;
							background: #FFFFFF;
							border-radius: 22rpx;
							font-size: 24rpx;
							font-family: PingFangSC-Regular, PingFang SC;
							font-weight: 400;
							color: #EB5E5F;
							text-align: center;
							line-height: 44rpx;
						}	
					}
					.line{
						margin: 10rpx 0;
						border-bottom: 1px dashed #fff;
					}
					.tip{
						height: auto;
						font-size: 24rpx;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: #FFFFFF;
					}
					.isOpen{
						overflow: hidden;
						text-overflow: ellipsis;
						white-space: nowrap;
					}
				}
				.CouponitemTitle {
					font-size: 28rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #333333;
				}

				.Couponitemtop {
					padding: 26rpx 40rpx;
					display: flex;

				}
			}
		}
		.gwpp {
			width: 710rpx;
			height: auto;
			margin: auto;
			background: #FFFFFF;
			border-radius: 5px;
			padding: 0 30rpx 40rpx;
			box-sizing: border-box;

			.topic {
				padding: 22rpx 0;
				position: relative;
				.cllor {
					font-size: 24rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #DB1B22;
					position: absolute;
					left: 0;
				}

				.topText {
					font-size: 32rpx;
					font-family: PingFangSC-Medium, PingFang SC;
					font-weight: 500;
					color: #333333;

				}

			}
			.dd{
				margin: 30rpx 0;
				.ddImg{
					width: 140rpx;
					height: 140rpx;
					background: #D8D8D8;
					border-radius: 10rpx;
					overflow: hidden;
				}
				.tterb{
					font-size: 24rpx;
					font-family: PingFangSC-Medium, PingFang SC;
					font-weight: 500;
					color: #333333;
					overflow: hidden;
				}
				.jg{
					font-size: 32rpx;
					font-family: PingFangSC-Semibold, PingFang SC;
					font-weight: 600;
					color: #DB1B22;
					margin: 16rpx 0;
					.s{
						font-size: 24rpx;
					}
				}
				.yfkc{
					font-size: 20rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #777777;
				}
			}
			.ggBox{
				padding: 10rpx 0;
				box-sizing: border-box;
				.gg{
					font-size: 28rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #333333;
					margin-bottom: 20rpx;
				}
				.item{
					width: auto;
					height: 60rpx;
					padding: 0 20rpx;
					background: #FFFFFF;
					border-radius: 4rpx;
					border: 1px solid #333333;
					line-height: 60rpx;
					margin-top: 10rpx;
					margin-right: 20rpx;
					font-size: 28rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #333333;

				}
				.item1{
					color: #DB1B22;
border: 1px solid #DB1B22;
				}
				.item2{
					color: #CCCCCC;
border: 1px solid #CCCCCC;
				}
				.add_sub{
					width: 90rpx;
					height: 60rpx;
					background: #FFFFFF;
					border-radius: 0rpx;
					border: 1px solid #333333;
					line-height: 60rpx;
					font-size: 28rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #333333;
					text-align: center;
				}
				.item_sub{
					border-right: none;
				}
				.bor_CBCCCD {
					border-top: 1px solid #cbcccd;
					border-bottom: 1px solid #cbcccd;
					border-left: 1px solid #cbcccd;
				}
				.bor_CBCCCC {
					border-top: 1px solid #cbcccd;
					border-bottom: 1px solid #cbcccd;
					border-right: 1px solid #cbcccd;
				}
				.item_value{
					min-width: 120rpx;
					input{
						height: 100%;
					}
				}
				.item_add{
					border-left: none;
				}
			}
			.addCart{
				width: 316rpx;
				height: 70rpx;
				background: #CA9756;
				border-radius: 36rpx;
				font-size:30rpx;
				font-family: PingFangSC-Semibold, PingFang SC;
				font-weight: 600;
				color: #FFFFFF;
				line-height: 70rpx;
				text-align: center;
				margin-top: 40rpx;
			}
			.bgc_DB1B22{
				background-color: #DB1B22;
			}
		}
	}
	.ModalHide {
		width: 100%;
		height: 100%;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 100010;
	
		.Share {
			position: absolute;
			bottom: 230rpx;
			left: 80rpx;
			width: 80%;
			display: flex;
			justify-content: space-between;
	
			.shareItem {
				text-align: center;
				.shareimg{
					width: 60rpx;
					height: 60rpx;
				}
				image {
					width: 120rpx;
					height: 120rpx;
				}
				.content{
					font-size: 24rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #FFFFFF;
				}
			}
			.share1{
				// width: 84rpx;
				// height: 84rpx;
				padding: 0;
				// border-radius: 50%;
				border: none;
				background: rgba(0,0,0,0);
			}
		}
		.Share1{
			bottom: 80rpx;
			justify-content: center;
		}
	}
	.popup2{
		background-color: #fff;
		    display: flex;
		    flex-direction: column;
		    align-items: center;
		    background: #fff;
		    padding: 5px;
			padding-bottom: 20px;
		// position: fixed;
		// top: 0;
		// left: 0;
		// &>view{
		// 	position: absolute;
		// 	top: 0;
		// 	left: 0;
		// 	bottom: 0;
		// 	right: 0;
		// 	margin: auto;
		// }
	}
</style>
<template>
	<view class="main">
		<myNavbar :navigationBarStyle="navigationBarStyle" :showBack="true"></myNavbar>
		<view class="top" style="position: relative;">
			<image style="width: 100%;height: 450rpx;" :src="dataList.article.cover" mode=""></image>
			<view style="width: 100%;height: 450rpx;position: absolute;top: 0;left: 0;background-color: rgba(0,0,0,0.5);">
				
			</view>
			<view class="top_text">
				{{dataList.article.title}}
			</view>
		</view>
		<view class="userTx flex_r_between">
			<view class="flex_r_start"  @click="$linkTo('../../search/author?pid='+dataList.article.customer_id)">
				<view class="userImg">
					<image :src="dataList.article.avater" mode=""></image>
				</view>
				<view class="content">
					<view class="title">{{dataList.article.nickname}}</view>
					<view class="title1">{{dataList.article.introduction}}</view>
				</view>
			</view>
			<view class="gz" :class="{gz1:dataList.article.is_attention==1?true:false}" @click="gzMth">{{dataList.article.is_attention==1?'取消关注':'关注'}}</view>
		</view>
		<view class="" v-for="(item,index) in dataList.article.content" :key="index">
			<view class="contentWZ" v-if="item.type==='text'">
				<view class="" v-html="item.content">
					<!-- {{item.content}} -->
				</view>
			</view>
			<view class="contentImg" v-if="item.type==='image'">
				<image :src="item.content" mode="widthFix"></image>
			</view>
			<view class="te flex_r_between"  v-if="item.type==='article'">
				<view class="teImg ">
					<image :src="item.article.cover" mode="widthFix"></image>
				</view>
				<view class="rightC flex_justify_content_end">
					<view class="content">{{item.article.title}}</view>
					<view class="seewenz" @click="$linkTo('./article_detail?article_id='+item.article.id)">查看文章</view>
				</view>
			</view>
			<view class="contentImg contentvideo"  v-if="item.type=='video'">
				<video style="width: 100%;height: 100%;" :custom-cache='false' enable-play-gesture show-mute-btn  :src="item.content"></video>
			</view>
		</view>
		<view class="marginBox"></view>
		<view class="userTx flex_r_between">
			<view class="flex_r_start">
				<view class="userImg">
					<image :src="dataList.article.avater" mode=""></image>
				</view>
				<view class="content">
					<view class="title">{{dataList.article.nickname}}</view>
					<view class="title1">{{dataList.article.introduction}}</view>
				</view>
			</view>
			<view class="dzBox flex_r_center " @click="like" :class="{dzBox1:dataList.article.is_like==1?true:false}">
				<image src="../../../static/homeImg/icon/dz.png" mode=""></image>{{dataList.article.is_like==1?'已点赞':'给TA点赞'}}
			</view>
		</view>
		<view class="marginBox" v-if="(JSON.stringify(dataList.goods_info)=='{}' || dataList.goods_info==null)?false:true"></view>
		<view class="goods_information" v-if="(JSON.stringify(dataList.goods_info)=='{}' || dataList.goods_info==null)?false:true">
			<view class="goods_title">商品信息</view>
			<view class="goods_box flex_r_between flex_item_center" @click="goodsDetail(dataList.goods_info.goods_id)">
				<view class="goods_img">
					<image :src="dataList.goods_info.cover" mode=""></image>
				</view>
				<view class="rightcontent">
					<view class="q">{{dataList.goods_info.name}}</view>
					<view class="w flex_r_between">
						<view class="s" v-if="dataList.goods_info.group_buy_price"><span class="r">￥</span>{{dataList.goods_info.group_buy_price}}<text style="margin-left: 8rpx;color: #999999;font-size: 28rpx; text-decoration: line-through;">{{dataList.goods_info.price}}</text></view>
						<view class="s" v-else><span class="r">￥</span>{{dataList.goods_info.price}}</view>
						<view class="d">好评率<span class="c">{{$amountCvs((dataList.goods_info.comments_nice_total/dataList.goods_info.comments_total)*100)+'%'}}</span></view>
					</view>
				</view>
			</view>
			<view v-if="dataList.goods_info.say">
				<view class="mm">吃货说</view>
				<view class="kuang">
					<view class="ert">
						<view class="sdf"></view>
					</view>{{dataList.goods_info.say}}
				</view>
			</view>
		</view>
		<view class="marginBox" v-if="(JSON.stringify(dataList.goods_info)=='{}' || dataList.goods_info==null)?false:true||Notice"></view>
		<!-- 购前须知 -->
		<!-- <view class="Notice" v-show="Object.keys(before_mai).length===0?false:true"> -->
		<!-- <view class="Notice" >
			<view class="n_title">
				购前须知
			</view>
			<view class="zxc flex_r_between flex_item_start" :class="{border_dashed:item!==2?true:false}" v-for="(item,key) in before_mai" :key="item">
				<view class="leftText">
					{{item[0]}}:
				</view>
				<view class="rightText">
					{{item[1]}}:
				</view>
			</view>
		</view> -->
		<view class="Notice" v-if="(JSON.stringify(dataList.goods_info)=='{}' || dataList.goods_info==null)?false:true||Notice">
			<view class="NoticeTitle">购前须知</view>
			<view class="NoticeReminder" v-for="(item,index) in Notice" :key="index" v-show="item[1]?false:true">
				<view class="ReminderLeft">{{item[0]}}:</view>
				<view class="ReminderRight">{{item[1]}}</view>
			</view>
			<!-- <view class="NoticeClick" @click="Openbox" v-if="Openchange==false">
				<view>
					点击查看更多
				</view>
				<image src="@/static/direction_right_blackcopy2.png"></image>
			</view> -->
		</view>
		<view class="marginBox" v-if="(JSON.stringify(dataList.goods_info)=='{}' || dataList.goods_info==null)?false:true||coupon.length===0?false:true"></view>
		<view class="boxList" v-if="(JSON.stringify(dataList.goods_info)=='{}' || dataList.goods_info==null)?false:true||coupon.length===0?false:true">
			<view class="">
				<view class="jilITem flex_r_between" @click="popup1a">
					<view class="flex_r_between">
						<!-- <view class="icTe">{{item.name}}</view> -->
						<view class="icTe icTe1">优惠</view>
						<view class="icTe2" v-for="(item,index) in coupon" v-if="index<2" :key="item">
							满{{parseInt(item.limit)}}减{{parseInt(item.amount)}}
						</view>
					</view>
					<view class="flex_r_between" >
						<view class="lingquan">领券</view>
						<view>
							<image style="width: 24rpx;height: 24rpx;" src="../../../static/direction_right_gray.png" mode=""></image>
						</view>
					</view>
				</view>
				<view class="line" v-if="item!==2"></view>
			</view>
		</view>
		<view class="boxList" v-if="JSON.stringify(dataList.goods_info)!='{}'">
			<view class="">
				<view class="jilITem flex_r_between" @click="openPopup(dataList.goods_info.share_buy)">
					<view class="flex_r_between">
						<!-- <view class="icTe">{{item.name}}</view> -->
						<view class="icTe icTe1">规格</view>
						<view class="lingquan" v-if="goods_specs_name=='无'">请选择</view>
						<view class="lingquan" v-else>{{goods_specs_name}}*{{goods_num}}</view>
					</view>
					<view class="flex_r_between" >
						<view class="lingquan"></view>
						<view>
							<image style="width: 24rpx;height: 24rpx;" src="../../../static/direction_right_gray.png" mode=""></image>
						</view>
					</view>
				</view>
				<view class="line" v-if="item!==2"></view>
			</view>
		</view>
		<view class="boxList" v-if="JSON.stringify(dataList.goods_info)!='{}'">
			<view class="">
				<view class="jilITem flex_r_between">
					<view class="flex_r_between">
						<!-- <view class="icTe">{{item.name}}</view> -->
						<view class="icTe icTe1">配送</view>
						<view class="lingquan">
							{{dataList.goods_info.store_home}}
						</view>
					</view>
					<view class="flex_r_between" >
						<view class="lingquan"></view>
						<view>
						</view>
					</view>
				</view>
				<view class="line" v-if="item!==2"></view>
			</view>
		</view>
		<view class="marginBox"></view>
		<!-- 评论 -->
		<!-- <view class="boxList" v-if="dataList.comments.length!==0"> -->
		<view class="boxList" >
			<view class="comment">
				<view class="headerO flex_r_between">
					<view class="q">评论</view>
					<view class="w flex_item_center" @click="$linkTo('./comment?article_id='+dataList.article.article_id)">查看全部<image src="../../../static/direction_right_gray.png"
						 mode=""></image>
					</view>
				</view>
				<view class="commentItem commentItem1" v-if="dataList.comments.length==0">
					暂无留言
				</view>
				<view class="commentItem" v-for="(item,index) in dataList.comments" :key="index" v-if="index<2">
					<view class="flex_r_between">
						<view class="userName">{{item.nickname}}</view>
						<view class="NumLikes flex_item_center" @click="likeComment(item.comment_id,index)">
							<image style="width: 24rpx;height: 22rpx;margin-right: 10rpx;" src="../../../static/homeImg/icon/dz1.png" mode=""></image>{{item.liked}}
						</view>
					</view>
					<view class="content">{{item.content}}</view>
					<view class="oprtu" v-for="(item1,index1) in item.reply_comment" :key="index1">
						<view class="mt">{{item1.nickname}}</view>
						<view class="nptu">{{item1.content}}</view>
					</view>
				</view>
			</view>
		</view>
		<view class="marginBox" v-show="dataList.recommend_article.length===0?false:true"></view>
		<view class="boxList" v-show="dataList.recommend_article.length===0?false:true">
			<view class="rmtjBox">
				<view class="rmtj">
					热门推荐
				</view>
				<view class="flex_r_between_wrap">
					<view class="item" v-for="(item,index) in dataList.recommend_article" :key="index" @click="$linkTo('./article_detail?article_id='+item.id)">
						<view class="toc">
							<image :src="item.cover" mode=""></image>
						</view>
						<view class="toiff">{{item.title}}</view>
					</view>
				</view>
			</view>
		</view>
		<view class="xffx">
			<button open-type="share" class="share">
				<image style="width: 84rpx;height: 84rpx;" src="../../../static/homeImg/icon/xffx.png" mode=""></image>
			</button>
		</view>
		<view class="marginBox" style="height: 98rpx;"></view>
		<view class="tabbarGm savebottom flex_r_between"  v-if="(JSON.stringify(dataList.goods_info)=='{}' || dataList.goods_info==null)?false:true">
			<view class="flex_r_between">
				<view class="bgt">
					<button open-type="contact" plain session-from="weapp"><image style="width: 40rpx;height: 40rpx;" src="../../../static/homeImg/icon/kf.png" mode=""></image>
					<view class="aaaqwe">
						客服
					</view></button>
				</view>
				<view class="bgt" @click="collection">
					<image v-show="dataList.article.is_collection!=1" style="width: 40rpx;height: 40rpx;" src="../../../static/homeImg/icon/sc.png" mode=""></image>
					<image v-show="dataList.article.is_collection==1" style="width: 40rpx;height: 40rpx;" src="../../../static/homeImg/icon/sc1.png" mode=""></image>
					<view class="aaaqwe">
						收藏
					</view>
				</view>
				<view class="bgt" @click="$linkTo('./comment_add?article_id='+dataList.article.article_id)">
					<image style="width: 40rpx;height: 40rpx;" src="../../../static/homeImg/icon/pl.png" mode=""></image>
					<view class="aaaqwe">
						评论
					</view>
				</view>
			</view>
			<view class="gmBtn" @click="openPopup1" v-if="dataList.goods_info.share_buy">
				<view style="display: flex;flex-direction: column;">
				<text style="font-size: 24rpx;height: 32rpx;line-height: 32rpx;">拼团购买</text>
				<text style="font-size: 24rpx;height: 32rpx;line-height: 32rpx;">拼团购买，立省{{dataList.goods_info.price-dataList.goods_info.group_buy_price}}元</text>	
				</view>
				<image style="width: 26rpx;height: 22rpx;margin-left: 12rpx;" src="../../../static/direction_right_white.png" mode=""></image>
			</view>
			<view class="gmBtn" @click="openPopup" v-else>
				￥{{dataList.goods_info.price}} <span>购买</span>
				<image style="width: 26rpx;height: 22rpx;margin-left: 12rpx;" src="../../../static/direction_right_white.png" mode=""></image>
			</view>
		</view>
		<uni-popup ref="popup4" type="center">
			<!-- <view class="canGetCoupon1" style="overflow-x: scroll;" v-if="popup4"> -->
				
			<view class="popup2">
				<canvas style="width: 375px;height: 680px;" canvas-id="mycanvas" type="mycanvas" @error="canvasIdErrorCallback" />
				<button style="position: absolute;bottom: 0;left: 40%;" @click='addd' size="mini" type="warn">保存图片</button>
			</view>
		</uni-popup>
		<uni-popup ref="popup3" type="center">
			<view class="ModalHide" @click="changeModel()">
				<image style="width: 400rpx;position: absolute;top: 90px;right: 90px;" src="../../../static/c51551bb9e0b247d112cad949a588cd.png" mode="widthFix"></image>
				<view class="Share">
					<button id="wx" open-type="share" plain class="shareItem share1" @click="changeModel('wx')">
						<image src="@/static/share_wx.png"></image>
						<view class="content">
							微信好友
						</view>
					</button>
					<button  plain class="shareItem share1" @click.stop="changeModel('ewm')">
						<image src="@/static/share_ewm.png"></image>
						<view class="content">
							二维码海报
						</view>
					</button>
				</view>
				<view class="Share Share1" >
					<view class="shareItem" @click="changeModel()">
						<image class="shareimg" src="@/static/cloce_white.png"></image>
					</view>
				</view>
			</view>
		</uni-popup>
		<uni-popup ref="popup2" type="center">
			<view class="popup2">
					<image :src="dataList.goods_info.share.share_origin_image" mode="widthFix" style="width: 100%;"></image>
					<view class="title" style="font-size: 24rpx;font-family: PingFangSC-Medium, PingFang SC;font-weight: 500;color: #333333; margin-bottom: 10px;">
						{{dataList.goods_info.share.share_title}}
					</view>
					<view class="price" style="font-size: 36rpx;font-family: PingFangSC-Semibold, PingFang SC;font-weight: 600; color: #DB1B22; margin-bottom: 10px;">
						￥{{dataList.goods_info.group_buy_price}}
					</view>
					<view class="ps" style="font-size: 24rpx;font-family: PingFangSC-Medium, PingFang SC;font-weight: 500;color: #333333;margin-bottom: 10px;">
						分享到朋友圈可安活动价购买哦
					</view>
					<view class="button" @click="openPopup3" style="background: red;color: #fff; padding: 5px 20px;border-radius: 50px;">
						立即分享
					</view>
			</view>
		</uni-popup>
		<uni-popup ref="popup1" type="bottom">
			<view class="canGetCoupon">
				<image class="img" src="@/static/nav_close.png" @click="popup1close()" style="width: 60rpx;height: 60rpx;"></image>
					<view class="item_title">
						商品劵
					</view>
				<scroll-view scroll-y class="canGetCouponitem">
					<view class="item" v-for="(item,index) in coupon" :key="index">
						<view class="q flex_r_between">
							<view class="flex_r_start">
								<view class="dw">￥</view>
								<view class="jiazhi">{{parseInt(item.amount)}}</view>
							</view>
							<view>
								<view class="fw">{{item.name}}</view>
								<view class="rq">{{$dateFormat(item.date_start*1000,'Y.m.d')}}-{{$dateFormat(item.date_end*1000,'Y.m.d')}}</view>
							</view>
							<view class="ljsy" @click="syyhj(item.coupon_id)">立即使用</view>
						</view>
						<view class="line"></view>
						<view class="flex_r_between" @click="openauanbu(index)">
							<view class="tip" :class="{isOpen:isOpen==index?false:true}">{{item.content}}</view>
							<view ><image style="width: 24rpx;height: 24rpx;" src="../../../static/spokesmanImg/icon/direction_right_black.png" mode=""></image></view>
						</view>
						
						<view class="psi l"></view>
						<view class="psi r"></view>
					</view>
				</scroll-view>
			</view>
		</uni-popup>
		<uni-popup ref="popup">
			<view class="gwpp">
				<view class="topic flex_r_center">
					<view class="cllor" @click="closePopup">取消</view>
					<view>编辑订单</view>
				</view>
				<view class="dd flex_r_between">
					<view class="ddImg">
						<image style="width: 140rpx;height: 140rpx;" :src="dataList.goods_info.cover" mode=""></image>
					</view>
					<view style="width: 490rpx;">
						<view class="tterb">{{dataList.goods_info.name}}</view>
						<view class="jg"><span class="s">￥</span>{{goods_specs_price}}</view>
						<view class="yfkc">已选：{{goods_specs_name}}<span style="margin: 0 10rpx;">|</span>库存 {{goods_specs_stock}}</view>
					</view>
				</view>
				<!-- v-for="(item,index) in dataList.goods_info.specs" :key="index" -->
				<view class="ggBox" >
					<view class="gg">
						<!-- {{item.name}} -->
						产品名称
					</view>
					<view class="flex_r_start_wrap" v-for="(item1,index1) in dataList.goods_info.options" :key="index1">
						<view class="item" :class="{item1:goods_specs_id===item1.id?true:false}" @click="goods_specs_id=item1.id;goods_specs_name=item1.name;goods_specs_stock=item1.stock;goods_specs_price=item1.price">
							{{item1.name}}
						</view>
						<!-- <view class="item item1">
							柠檬味
						</view>
						<view class="item item2">
							菠萝味
						</view> -->
					</view>
				</view>
				<view class="ggBox">
					<view class="gg">
						数量
					</view>
					<view class="flex_r_start">
						<view class="add_sub item_sub" :class="{bor_CBCCCD:goods_num<=1}" @click="goods_num--">-</view>
						<view class="add_sub item_value"><input type="text" v-model="goods_num" /></view>
						<view class="add_sub item_add" :class="{ bor_CBCCCC: goods_num >= goods_specs_stock }" @click="goods_num++">+</view>
						<!-- <view class="add_sub item_add" @click="goods_num++">+</view> -->
					</view>
				</view>
				<view class="flex_r_between">
					<view class="addCart" @click="addCart">加入购物车</view>
					<view class="addCart bgc_DB1B22" @click="ToUrl">立即购买</view>
				</view>
			</view>
		</uni-popup>
		<tki-qrcode v-if="ifShow" cid="qrcode1" ref="qrcode" :val="val" :size="size" :unit="unit" :background="background" :foreground="foreground" :pdground="pdground" :icon="icon" :iconSize="iconsize" :lv="lv" :onval="onval" :loadMake="loadMake" :usingComponents="true" @result="qrR" />
		<input v-if="ifShow" class="uni-input" placeholder="请输入要生成的二维码内容" v-model="val" />
		<button v-if="ifShow" type="primary" @tap="creatQrcode">生成二维码</button>
	</view>
</template>

<script>
	import myNavbar from '../../../myComponents/myNavbar.vue'
	export default {
		data() {
			return {
				paths:null,
				popup4:false,
				ifShow: false,
				val: '', // 要生成的二维码值
				size: 200, // 二维码大小
				unit: 'upx', // 单位
				background: '#fff', // 背景色
				foreground: '#000', // 前景色
				pdground: '#000', // 角标色
				icon: '', // 二维码图标
				iconsize: 40, // 二维码图标大小
				lv: 3, // 二维码容错级别 ， 一般不用设置，默认就行
				onval: true, // val值变化时自动重新生成二维码
				loadMake: true, // 组件加载完成后自动生成二维码
				src: 'https://wap.feelmao.com/goods_detail.html?customer_id=0&goods_id=143',
				id:'',
				goods_specs_id:'',
				goods_specs_stock:'',
				goods_specs_price:'',
				goods_specs_name:'无',
				isSc: false,
				isDz: false,
				goods_num: 1,
				navigationBarStyle: {
					background: '',
					fontColor: '#000000',
					iconColor: '#000000',
					iconText: ''

				},
				dataList: [],
				before_mai:'',
				before_mai1:[],
				NewNotice:[],
				Notice:[],
				isOpen:NaN,
				coupon:[]
			};
		},
		watch: {
			goods_num: function(val, oldVal) {
				if (val < 1) {
					this.goods_num = 1
				}
				if (val > this.goods_specs_stock) {
					this.goods_num = this.goods_specs_stock;
				}
			}
		},
		onLoad(option) {
			uni.showShareMenu({
			withShareTicket: true,
			menus: ['shareAppMessage', 'shareTimeline']
			})
			this.id=option.article_id
			this.$request('/app/article/articleDetail', 'post', {
				article_id: option.article_id,
				access_token: uni.getStorageSync('access_token').replace(/^\"|\"$/g,'')
			}).then(res => {
				this.dataList = res.content
				console.log(this.dataList)
				this.val = res.content.share.url;
				if(res.content.goods_info.share){
					let arr = trimSpace(res.content.goods_info.before_mai.split(/[\n\r]/))
					this.Notice = arr.map(v => {
						return v.split("：")
					})
				this.downLoadImg(res.content.goods_info.share.share_origin_image);
				this.val = res.content.goods_info.share.url;
				}
				function trimSpace(array) {
					for (var i = 0; i < array.length; i++) {
						if (array[i] == "" || typeof(array[i]) == "undefined") {
							array.splice(i, 1);
							i = i - 1;
						}
					}
					return array;
				}
				
				// let arr = trimSpace(res.data.content.before_mai.split(/[\n\r]/))
				// // this.before_mai= "{\"" +res.content.goods_info.before_mai.replace(/：/g,"\":\"").replace(/\n\n/g,"\",\"") + "\"}"
				// this.before_mai= arr.map(v => {
				// 		return v.split("：")
				// 	})
				console.log(this.Notice,111)
			})
			this.$request('/app/coupon/canGetCoupon','post').then(res=>{
				this.coupon=res.content
			})
			
		},
		onShow() {
			this.creatQrcode();
		},
		methods: {
			popup1close(){
				this.$refs.popup1.close()
			},
			syyhj(e){
				console.log(e)
				this.$request('/app/coupon/drawCoupon','post',{
					access_token: this.access_token,
					coupon_id:e
				}).then(res=>{
					uni.showToast({
						title:res.message,
						icon:'none'
					})
				})
			},
			openauanbu(index){
				if(this.isOpen===NaN || this.isOpen!==index){
					this.isOpen=index
				}else{
					this.isOpen=NaN
				}
				
			},
			GetCoupon(){
				this.$refs.popup1.close()
			},
			popup1a(){
				this.$refs.popup1.open()
			},
			likeComment(comment_id,index){
				this.$request('/app/article/likeComment','post',{
					access_token: uni.getStorageSync('access_token').replace(/^\"|\"$/g,''),
					comment_id:comment_id
				}).then(res=>{
					if(res.message==="点赞成功"){
						this.dataList.comments[index].liked=1
					}
					if(res.message==="取消点赞成功"){
						this.dataList.comments[index].liked=0
					}
					console.log(this.dataList.comments)
					this.$set(this.dataList.comments,index,this.dataList.comments[index])
					uni.showToast({
						title:res.message,
						duration:2000,
						icon:'none'
					})
				})
			},
			collection(){ //收藏文章

				this.$request('/app/article/collection','post',{
					article_id: this.id,
					access_token: uni.getStorageSync('access_token').replace(/^\"|\"$/g,'')
				}).then(res=>{
					if(res.errcode==0){
						if(this.dataList.article.is_collection==1){
							this.dataList.article.is_collection=0
						}else{
							this.dataList.article.is_collection=1
						}
					}
				})
			},
			ToUrl(){
				if(!this.goods_specs_id){
					uni.showToast({
						title:'请选择产品',
						duration:2000,
						icon:'none'
					})
					return
				}
				let arr2 = []
						let obj = {}
						obj.quantity = this.goods_num,
						obj.cart_id = this.dataList.cart_id,
						obj.goods_id = this.dataList.goods_info.goods_id,
						obj.option_id = this.goods_specs_id,
						obj.is_collect = this.dataList.goods_info.is_collection,
						arr2.push(obj)
				let Arr1 = JSON.stringify(arr2)
				this.$request('/app/cart/settlement','post',{
					access_token:uni.getStorageSync('access_token').replace(/^\"|\"$/g,''),
					type:'1',
					t:3,
					data:Arr1
				}).then(res=>{
					if  (res.errcode==99){
					uni.showModal({
					    title: '提示',
					    content: res.message,
					    success: function (res) {
					        if (res.confirm) {
								uni.navigateTo({
									url:'/pages/login/login'
								})
					        } else if (res.cancel) {
					            console.log('用户点击取消');
					        }
					    }
					});
					}else if(res.errcode==0){
					uni.setStorage({
					    key: 'content',
					    data: JSON.stringify(res.content),
					    success: function () {
					    }
					});
					uni.navigateTo({
						url:"/pagesA/ConfirmOrder/ConfirmOrder"
					})
					}else{
						uni.showToast({
							title:res.message,
							icon:'none'
						})
					}
				})
			},
			addCart(){ // 加入购物车
				if(!this.goods_specs_id){
					uni.showToast({
						title:'请选择产品',
						duration:2000,
						icon:'none'
					})
					return
				}
				this.$request('/app/cart/addcart','post',{
					access_token: uni.getStorageSync('access_token').replace(/^\"|\"$/g,''),
					goods_id:this.dataList.goods_info.goods_id,
					quantity:this.goods_num,
					option_id:this.goods_specs_id,
					is_collect:this.dataList.goods_info.is_collection
				}).then(res=>{
					if  (res.errcode==99){
					uni.showModal({
					    title: '提示',
					    content: res.message,
					    success: function (res) {
					        if (res.confirm) {
								uni.navigateTo({
									url:'/pages/login/login'
								})
					        } else if (res.cancel) {
					            console.log('用户点击取消');
					        }
					    }
					});
					}else{
						let _this=this
						uni.showToast({
							title:res.message,
							duration:2000,
							icon:'none',
							success:function(){
								_this.closePopup()
							}
						})
					}
				})
			},
			like(){ //点赞

				this.$request('/app/article/like','post',{
					article_id: this.id,
					access_token: uni.getStorageSync('access_token').replace(/^\"|\"$/g,'')
				}).then(res=>{
					if(res.errcode==0){
						if(this.dataList.article.is_like==1){
							this.dataList.article.is_like=0
						}else{
							this.dataList.article.is_like=1
						}
					}
					uni.showToast({
						title:res.message,
						duration:2000,
						icon:'none'
					})
				})
			},
			gzMth(){ //关注
				this.$request('/app/community/attention','post',{
					access_token:uni.getStorageSync('access_token').replace(/^\"|\"$/g,''),
					pid:this.dataList.article.customer_id
				}).then(res=>{
					if(res.errcode==0){
						if(this.dataList.article.is_attention==1){
							this.dataList.article.is_attention=0
						}else{
							this.dataList.article.is_attention=1
						}
						
					}
					uni.showToast({
						title:res.message,
						duration:2000,
						icon:'none'
					})
				})
			},
			goodsDetail(goods_id){
				// uni.setStorage({
				// 	key: 'goods_id',
				// 	data: JSON.stringify(goods_id),
				// 	success: () =>{
				// 		this.$linkTo('../../shopping/shopping/CommodityDetails/CommodityDetails')
				// 	}
				// })
				this.$linkTo('/pagesA/CommodityDetails/CommodityDetails?goods_id='+goods_id)
			},
			openPopup(e) {
				if(e){
					return 	this.$refs.popup2.open()
				}
				this.$refs.popup.open()
			},
			openPopup1(){
				this.$refs.popup2.open()
			},
			getcanvas() {
				var context = uni.createCanvasContext('mycanvas');
				context.setFillStyle('#fff')
				context.setTextAlign('center');
				context.setFontSize(32);
				context.setFillStyle('#333');
				context.fillText('肥猫商城', 185, 64);
				context.setTextAlign('center');
				context.setFontSize(12);
				context.setFillStyle('#333');
				context.fillText(this.dataList.share.share_desc, 185, 104);
				context.setStrokeStyle('#F3F4F5');
				context.strokeRect(30, 145, 315, 420);
				console.log(this.paths,1212)
				// context.drawImage(this.paths, 30, 145, 315, 315);
				context.drawImage(this.paths, 30, 145, 315, 315);
				context.drawImage(this.dataList.goods_info.share.share_origin_image, 30, 145, 315, 315);
				context.setTextAlign('center');
				context.setFontSize(16);
				context.setFillStyle('#333');
				// context.fillText(this.data.share.share_title, 185, 500);
				writeTextOnCanvas(context, 16, 40, this.dataList.goods_info.share.share_title ,185, 500)
				
				function writeTextOnCanvas(ctx_2d, lineheight, bytelength, text ,startleft, starttop){
					function getTrueLength(str){//获取字符串的真实长度（字节长度）
						var len = str.length, truelen = 0;
						for(var x = 0; x < len; x++){
							if(str.charCodeAt(x) > 128){
								truelen += 2;
							}else{
								truelen += 1;
							}
						}
						return truelen;
					}
					function cutString(str, leng){//按字节长度截取字符串，返回substr截取位置
						var len = str.length, tlen = len, nlen = 0;
						for(var x = 0; x < len; x++){
							if(str.charCodeAt(x) > 128){
								if(nlen + 2 < leng){
									nlen += 2;
								}else{
									tlen = x;
									break;
								}
							}else{
								if(nlen + 1 < leng){
									nlen += 1;
								}else{
									tlen = x;
									break;
								}
							}
						}
						return tlen;
					}
					for(var i = 1; getTrueLength(text) > 0; i++){
						var tl = cutString(text, bytelength);
						ctx_2d.fillText(text.substr(0, tl).replace(/^\s+|\s+$/, ""), startleft, (i-1) * lineheight + starttop);
						text = text.substr(tl);
					}
				}
				// context.setTextAlign('center');
				// context.setFontSize(16);
				// context.setFillStyle('#999999');
				// context.fillText('肥猫爆款，吃一口就爱上', 185, 550);
				context.setFontSize(12);
				context.setFillStyle('#DB1B22');
				context.fillText('￥', 164, 550);
				context.setFontSize(16);
				context.setFillStyle('#DB1B22');
				context.fillText(this.dataList.goods_info.group_buy_price, 190, 550);
				// context.fillText('111', 190, 570);
				context.drawImage(this.src, 30, 605, 65, 65);
				// context.drawImage(this.src, 30, 625, 65, 65);
				context.setFontSize(12);
				context.setTextAlign('left');
				context.setFillStyle('#999999');
				context.fillText('长按图片识别二维码', 100, 634);
				context.setFontSize(12);
				context.setFillStyle('#999999');
				context.fillText('查看商品详情', 100, 651);
				context.stroke();
				context.draw();
			},
			addd(){
				console.log(1)
				let __that = this;
				uni.canvasToTempFilePath({
				  canvasId: 'mycanvas',
				  success: function(res) {
				    // 在H5平台下，tempFilePath 为 base64
				    console.log(res.tempFilePath)
					uni.getImageInfo({
					            src: res.tempFilePath,
					            success: function (image) {
					                console.log(image.path);
									uni.saveImageToPhotosAlbum({
										filePath: image.path,
										success() {
											uni.showToast({
												title:'保存成功'
											})
											this.$refs.popup4.close();
											console.log("success");
										},
										fail(e){
											//如果拒绝,让保存图片按钮变成打开设置的
											console.log(e)
											if(e.errMsg === "saveImageToPhotosAlbum:fail:auth denied" || e.errMsg === "saveImageToPhotosAlbum:fail auth deny" || e.errMsg === "saveImageToPhotosAlbum:fail authorize no response") {
											　　　　　　　　　　wx.showModal({
											　　　　　　　　　　　　title: '提示',
											　　　　　　　　　　　　content: '需要您授权保存相册',
											　　　　　　　　　　　　showCancel: false,
											　　　　　　　　　　　　success: modalSuccess => {
											　　　　　　　　　　　　　　wx.openSetting({
											　　　　　　　　　　　　　　　　success(settingdata) {
											　　　　　　　　　　　　　　　　　　if (settingdata.authSetting['scope.writePhotosAlbum']) {
											　　　　　　　　　　　　　　　　　　　　console.log('获取权限成功，给出再次点击图片保存到相册的提示。')
											this.$refs.popup4.close();
											　　　　　　　　　　　　　　　　　　}else {
											　　　　　　　　　　　　　　　　　　　　console.log('获取权限失败，给出不给权限就无法正常使用的提示')
											this.$refs.popup4.close();
											　　　　　　　　　　　　　　　　　　}
											　　　　　　　　　　　　　　　　}
											　　　　　　　　　　　　　　})
											　　　　　　　　　　　　}
											　　　　　　　　　　})
											　　　　　　　　}　　
										}
									})
					            }
					        });
			
				  } 
				})
			},
			downLoadImg(netUrl) {
			    wx.getImageInfo({
			      src: netUrl,    //请求的网络图片路径
			      success:(res)=> {
			        //请求成功后将会生成一个本地路径即res.path,然后将该路径缓存到storageKeyUrl关键字中
					this.paths=res.path
					console.log(this.paths)
			      }
			    })
			  },
			qrR(res) {
				this.src = res;
				this.getcanvas();
			},
			creatQrcode() {
				this.$refs.qrcode._makeCode();
				console.log(this.src);
				this.qrR();
			},
			changeModel(e){
				if (e == 'ewm') {
					this.ifShow=true
					// this.creatQrcode();
					this.$refs.popup3.close()
					this.$refs.popup4.open();
					// this.popup4=true
					setTimeout(v=>{
						this.ifShow=false
					},5000)
				}else{
					
				}
			},
			openPopup3(){
				this.$refs.popup2.close()
				this.$refs.popup3.open()
			},
			closePopup() {
				this.$refs.popup.close()
			}
		},
		onShareAppMessage(){
			this.$request('/app/article/share','post',{
				access_token:uni.getStorageSync('access_token').replace(/^\"|\"$/g,''),
				article_id:this.id
			})
		},
		onPageScroll(e) {
			// console.log(e.scrollTop);//距离页面顶部距离
			if (e.scrollTop > 138) {
				this.navigationBarStyle.iconText = '文章详情'
				this.navigationBarStyle.background = '#ffffff'
			} else {
				this.navigationBarStyle.iconText = ''
				this.navigationBarStyle.background = ''
			}
		},
		components: {
			myNavbar
		}
	}
</script>
